<template>
  <component :is="iconName"   :size="props.size" :spin="props.spin"  :style="fontStyle"/>
</template>

<script lang="ts" setup name="smart-icon">


import {computed} from "vue";

const props = defineProps({
  name: {
    type: String,
    require: true
  },
  size: {
    type: Number,
    require: false,
    default: 18
  },
  spin: {
    type: Boolean,
    require: false,
    default: false
  },
  color:{
    type:String,
    require: false,
    default: ''
  }
})

const iconName=computed(()=>{
  return  props.name.startsWith("icon")? props.name:'icon-star'
})
const fontStyle= {
  color:props.color
}
</script>
